<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8" />
  <meta http-equiv="X-UA-Compatible" content="IE=edge" />
  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
  <title>天天生鲜</title>
  <link rel="stylesheet" href="https://cdn.staticfile.org/twitter-bootstrap/4.3.1/css/bootstrap.min.css" />
  <script src="https://cdn.staticfile.org/jquery/3.2.1/jquery.min.js"></script>
  <script src="https://cdn.staticfile.org/popper.js/1.15.0/umd/popper.min.js"></script>
  <script src="https://cdn.staticfile.org/twitter-bootstrap/4.3.1/js/bootstrap.min.js"></script>
  <link rel="stylesheet" href="天天生鲜.css" />

  <script src="https://lf9-cdn-tos.bytecdntp.com/cdn/expire-1-M/jquery/3.6.0/jquery.min.js"></script>
</head>

<body>
  <div style="display: flex; flex-direction: column" >
    <div class="mydiv1">
      <div class="mydiv2">
        <span class="myspan1"> 欢迎来到天天生鲜！</span>
        <span class="myspan2"></span>
        <a href="" class="mya1">登录</a>
        <span>|</span>
        <a href="" class="mya1">注册</a>
        <span>|</span>
        <a href="" class="mya1">用户中心</a>
        <span>|</span>
        <a href="" class="mya1">我的购物车</a>
        <span>|</span>
        <a href="" class="mya1">我的订单</a>
      </div>
    </div>
    <div>
      <div class="mydiv3">
        <div>
          <a href=""> <img src="imgs/logo.png" class="mylogo1" /></a>
        </div>
        <div>
          <input type="text" placeholder="搜索商品" class="mytext1" />
          <input type="button" value="搜索" class="mybtn1" />
        </div>
        <div style="display: flex">
          <a href="#" class="mya2">我的购物车 </a>
          <input type="button" class="mybtn2" value="5" />
        </div>
      </div>
    </div>
    <div class="mydiv4">
      <div style="display: flex; width: 1200px">
        <h1 class="myh1_1">全部商品分类</h1>
        <a href="#" class="mya3">首页</a>
        <span class="myspan3">|</span>
        <a href="#" class="mya3">手机生鲜</a>
        <span class="myspan3">|</span>
        <a href="#" class="mya3">抽奖</a>
        <span style="flex: 1"></span>
      </div>
    </div>
    <div class="mydiv5">
      <div style="display: flex; width: 1200px">
        <ul>
          <li class="myli1">
            &nbsp;&nbsp;&nbsp;&nbsp;
            <a href="#1" id="mya4">
              <span style="font-size: 14px">新鲜水果</span>
            </a>
            <span class="myspan4">&gt; </span>
          </li>
          <li class="myli1">
            &nbsp;&nbsp;&nbsp;&nbsp;
            <a href="#2" id="mya5">
              <span style="font-size: 14px">海鲜水产</span>
            </a>
            <span class="myspan4">&gt; </span>
          </li>
          <li class="myli1">
            &nbsp;&nbsp;&nbsp;&nbsp;
            <a href="#3" id="mya6">
              <span style="font-size: 14px">猪牛羊肉</span>
            </a>
            <span class="myspan4">&gt; </span>
          </li>
          <li class="myli1">
            &nbsp;&nbsp;&nbsp;&nbsp;
            <a href="#4" id="mya7">
              <span style="font-size: 14px">禽类蛋品</span>
            </a>
            <span class="myspan4">&gt; </span>
          </li>
          <li class="myli1">
            &nbsp;&nbsp;&nbsp;&nbsp;
            <a href="#5" id="mya8">
              <span style="font-size: 14px">新鲜蔬菜</span>
            </a>
            <span class="myspan4">&gt; </span>
          </li>
          <li class="myli1">
            &nbsp;&nbsp;&nbsp;&nbsp;
            <a href="#6" id="mya9">
              <span style="font-size: 14px">速冻食品</span>
            </a>
            <span class="myspan4">&gt; </span>
          </li>
        </ul>

        <div class="mydiv13">
          <div id="demo" class="carousel slide" data-ride="carousel  " style="width: 760px; height: 270px">
            <ul class="carousel-indicators">
              <li data-target="#demo" data-slide-to="0" class="active"></li>
              <li data-target="#demo" data-slide-to="1"></li>
              <li data-target="#demo" data-slide-to="2"></li>
              <li data-target="#demo" data-slide-to="3"></li>
            </ul>

            <div class="carousel-inner" style="width: 762px">
              <div class="carousel-item active" style="width: 762px">
                <img src="imgs/鱼虾.jpg" style="width: 762px" />
              </div>
              <div class="carousel-item">
                <img src="imgs/肉排.jpg" style="width: 762px" />
              </div>
              <div class="carousel-item">
                <img src="imgs/芒果.jpg" style="width: 762px" />
              </div>
              <div class="carousel-item">
                <img src="imgs/水果.jpg" style="width: 762px" />
              </div>
            </div>

            <a class="carousel-control-prev" href="#demo" data-slide="prev">
              <span class="carousel-control-prev-icon"></span>
            </a>
            <a class="carousel-control-next" href="#demo" data-slide="next">
              <span class="carousel-control-next-icon"></span>
            </a>
          </div>
        </div>

        <div style="display: flex; flex-direction: column">
          <img src="imgs/tp1.jpg" />
          <img src="imgs/tp2.jpg" />
        </div>
      </div>
    </div>
    <div class="mydiv6">
      <div class="mydiv7">
        <div class="mydiv8">
          <h3 class="myh3_1" id="1">新鲜水果</h3>
          <div class="mydiv9">
            <span class="myspan5">|</span>
            <a href="#" class="mya4">盒装草莓</a>
            <a href="#" class="mya5">柠檬</a>
            <a href="#" class="mya6">查看更多 &gt;</a>
          </div>
        </div>
      </div>
    </div>
    <div class="mydiv10">
      <div style="display: flex; width: 1200px">
        <span style="width: 200px; height: 300px">
          <img src="imgs/tp3.jpg" />
        </span>

        <ul style="display: flex">

          <li class="myli2">
            <h4 class="myh4_1"><a href="#" class="mya7">草莓500g</a></h4>
            <a href="草莓购物车.html" class="mya8">
              <img src="imgs/草莓.jpg" class="myimgs_1" /></a>
            <h4 class="myh4_2">￥10.00</h4>
          </li>
          
          <li class="myli2">
            <h4 class="myh4_1"><a href="#" class="mya7">葡萄</a></h4>
            <a href="#" class="mya8"><img src="imgs/葡萄.jpg" class="myimgs_1" /></a>
            <h4 class="myh4_2">￥20.00</h4>
          </li>
          <li class="myli2">
            <h4 class="myh4_1"><a href="#" class="mya7">奇异果</a></h4>
            <a href="#" class="mya8"><img src="imgs/奇异果.jpg" class="myimgs_1" /></a>
            <h4 class="myh4_2">￥12.12</h4>
          </li>
          <li class="myli2">
            <h4 class="myh4_1"><a href="#" class="mya7">柠檬</a></h4>
            <a href="#" class="mya8"><img src="imgs/柠檬.jpg" class="myimgs_1" /></a>
            <h4 class="myh4_2">￥32.00</h4>
          </li>
        </ul>
      </div>
    </div>
    <div class="mydiv6">
      <div class="mydiv7">
        <div class="mydiv8">
          <h3 class="myh3_1" id="2">海鲜水产</h3>
          <div class="mydiv9">
            <span class="myspan5">|</span>
            <a href="#" class="mya4">基围大虾</a>
            <a href="#" class="mya5">扇贝</a>
            <a href="#" class="mya6">查看更多 &gt;</a>
          </div>
        </div>
      </div>
    </div>
    <div class="mydiv10">
      <div style="display: flex; width: 1200px">
        <span style="width: 200px; height: 300px">
          <img src="imgs/tp4.jpg" />
        </span>
        <ul style="display: flex">
          <li class="myli2">
            <h4 class="myh4_1"><a href="#" class="mya7">大青虾</a></h4>
            <a href="#" class="mya8"><img src="imgs/大青虾.jpg" class="myimgs_1" /></a>
            <h4 class="myh4_2">￥34.00</h4>
          </li>
          <li class="myli2">
            <h4 class="myh4_1"><a href="#" class="mya7">北海道秋刀鱼</a></h4>
            <a href="#" class="mya8"><img src="imgs/北海道秋刀鱼.jpg" class="myimgs_1" /></a>
            <h4 class="myh4_2">￥50.00</h4>
          </li>
          <li class="myli2">
            <h4 class="myh4_1"><a href="#" class="mya7">扇贝</a></h4>
            <a href="#" class="mya8"><img src="imgs/扇贝.jpg" class="myimgs_1" /></a>
            <h4 class="myh4_2">￥56.60</h4>
          </li>
          <li class="myli2">
            <h4 class="myh4_1"><a href="#" class="mya7">基围虾</a></h4>
            <a href="#" class="mya8"><img src="imgs/基围虾.jpg" class="myimgs_1" /></a>
            <h4 class="myh4_2">￥100.90</h4>
          </li>
        </ul>
      </div>
    </div>

    <div class="mydiv6">
      <div class="mydiv7">
        <div class="mydiv8">
          <h3 class="myh3_1" id="3">猪牛羊肉</h3>
          <div class="mydiv9">
            <span class="myspan5">|</span>
            <a href="#" class="mya4">牛肉牛排</a>
            <a href="#" class="mya5">羊肉</a>
            <a href="#" class="mya6">查看更多 &gt;</a>
          </div>
        </div>
      </div>
    </div>
    <div class="mydiv10">
      <div style="display: flex; width: 1200px">
        <span style="width: 200px; height: 300px">
          <img src="imgs/tp5.jpg" />
        </span>
        <ul style="display: flex">
          <li class="myli2">
            <h4 class="myh4_1"><a href="#" class="mya7">猪肉</a></h4>
            <a href="#" class="mya8"><img src="imgs/猪肉.jpg" class="myimgs_1" /></a>
            <h4 class="myh4_2">￥23.99</h4>
          </li>
          <li class="myli2">
            <h4 class="myh4_1"><a href="#" class="mya7">鸡腿</a></h4>
            <a href="#" class="mya8"><img src="imgs/鸡腿.jpg" class="myimgs_1" /></a>
            <h4 class="myh4_2">￥45.00</h4>
          </li>
          <li class="myli2">
            <h4 class="myh4_1"><a href="#" class="mya7">羊肉</a></h4>
            <a href="#" class="mya8"><img src="imgs/羊肉.jpg" class="myimgs_1" /></a>
            <h4 class="myh4_2">￥56.99</h4>
          </li>
          <li class="myli2">
            <h4 class="myh4_1"><a href="#" class="mya7">牛排</a></h4>
            <a href="#" class="mya8"><img src="imgs/牛排.jpg" class="myimgs_1" /></a>
            <h4 class="myh4_2">￥99.99</h4>
          </li>
        </ul>
      </div>
    </div>

    <div class="mydiv6">
      <div class="mydiv7">
        <div class="mydiv8">
          <h3 class="myh3_1" id="4">禽类蛋品</h3>
          <div class="mydiv9">
            <span class="myspan5">|</span>
            <a href="#" class="mya4">盒装鸡蛋</a>
            <a href="#" class="mya5">鸭蛋</a>
            <a href="#" class="mya6">查看更多 &gt;</a>
          </div>
        </div>
      </div>
    </div>
    <div class="mydiv10">
      <div style="display: flex; width: 1200px">
        <span style="width: 200px; height: 300px">
          <img src="imgs/tp6.jpg" />
        </span>
        <ul style="display: flex">
          <li class="myli2">
            <h4 class="myh4_1"><a href="#" class="mya7">鸡蛋</a></h4>
            <a href="#" class="mya8"><img src="imgs/鸡蛋.jpg" class="myimgs_1" /></a>
            <h4 class="myh4_2">￥23.00</h4>
          </li>
          <li class="myli2">
            <h4 class="myh4_1"><a href="#" class="mya7">鸭蛋</a></h4>
            <a href="#" class="mya8"><img src="imgs/鸭蛋.jpg" class="myimgs_1" /></a>
            <h4 class="myh4_2">￥45.00</h4>
          </li>
          <li class="myli2">
            <h4 class="myh4_1"><a href="#" class="mya7">鹌鹑蛋</a></h4>
            <a href="#" class="mya8"><img src="imgs/鹌鹑蛋.jpg" class="myimgs_1" /></a>
            <h4 class="myh4_2">￥39.80</h4>
          </li>
          <li class="myli2">
            <h4 class="myh4_1"><a href="#" class="mya7">鹅蛋</a></h4>
            <a href="#" class="mya8"><img src="imgs/鹅蛋.jpg" class="myimgs_1" /></a>
            <h4 class="myh4_2">￥49.90</h4>
          </li>
        </ul>
      </div>
    </div>

    <div class="mydiv6">
      <div class="mydiv7">
        <div class="mydiv8">
          <h3 class="myh3_1" id="5">新鲜蔬菜</h3>
          <div class="mydiv9">
            <span class="myspan5">|</span>
            <a href="#" class="mya4">白菜香菜</a>
            <a href="#" class="mya5">芹菜</a>
            <a href="#" class="mya6">查看更多 &gt;</a>
          </div>
        </div>
      </div>
    </div>
    <div class="mydiv10">
      <div style="display: flex; width: 1200px">
        <span style="width: 200px; height: 300px">
          <img src="imgs/tp7.jpg" />
        </span>
        <ul style="display: flex">
          <li class="myli2">
            <h4 class="myh4_1"><a href="#" class="mya7">白菜</a></h4>
            <a href="#" class="mya8"><img src="imgs/白菜.jpg" class="myimgs_1" /></a>
            <h4 class="myh4_2">￥4.50</h4>
          </li>
          <li class="myli2">
            <h4 class="myh4_1"><a href="#" class="mya7">芹菜</a></h4>
            <a href="#" class="mya8"><img src="imgs/芹菜.jpg" class="myimgs_1" /></a>
            <h4 class="myh4_2">￥3.50</h4>
          </li>
          <li class="myli2">
            <h4 class="myh4_1"><a href="#" class="mya7">香菜</a></h4>
            <a href="#" class="mya8"><img src="imgs/香菜.jpg" class="myimgs_1" /></a>
            <h4 class="myh4_2">￥7.90</h4>
          </li>
          <li class="myli2">
            <h4 class="myh4_1"><a href="#" class="mya7">红辣椒</a></h4>
            <a href="#" class="mya8"><img src="imgs/红辣椒.jpg" class="myimgs_1" /></a>
            <h4 class="myh4_2">￥11.00</h4>
          </li>
        </ul>
      </div>
    </div>

    <div class="mydiv6">
      <div class="mydiv7">
        <div class="mydiv8">
          <h3 class="myh3_1" id="6">速冻食品</h3>
          <div class="mydiv9">
            <span class="myspan5">|</span>
            <a href="#" class="mya4">蟹棒</a>
            <a href="#" class="mya5">速冻水饺</a>
            <a href="#" class="mya6">查看更多 &gt;</a>
          </div>
        </div>
      </div>
    </div>
    <div class="mydiv10">
      <div style="display: flex; width: 1200px">
        <span style="width: 200px; height: 300px">
          <img src="imgs/tp8.jpg" />
        </span>
        <ul style="display: flex">
          <li class="myli2">
            <h4 class="myh4_1"><a href="#" class="mya7">鱼丸</a></h4>
            <a href="#" class="mya8"><img src="imgs/鱼丸.jpg" class="myimgs_1" /></a>
            <h4 class="myh4_2">￥66.00</h4>
          </li>
          <li class="myli2">
            <h4 class="myh4_1"><a href="#" class="mya7">蟹棒</a></h4>
            <a href="#" class="mya8"><img src="imgs/蟹棒.jpg" class="myimgs_1" /></a>
            <h4 class="myh4_2">￥68.00</h4>
          </li>
          <li class="myli2">
            <h4 class="myh4_1"><a href="#" class="mya7">虾丸</a></h4>
            <a href="#" class="mya8"><img src="imgs/虾丸.jpg" class="myimgs_1" /></a>
            <h4 class="myh4_2">￥89.99</h4>
          </li>
          <li class="myli2">
            <h4 class="myh4_1"><a href="#" class="mya7">速冻水饺</a></h4>
            <a href="#" class="mya8"><img src="imgs/速冻水饺.jpg" class="myimgs_1" /></a>
            <h4 class="myh4_2">￥20.00</h4>
          </li>
        </ul>
      </div>
    </div>
    <div class="mydiv11">
      <div style="display: flex; width: 1200px; justify-content: center">
        <div class="mydiv12">
          <span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span>
          <a href="#" class="mya9">关于我们</a>
          <span>|</span>
          <a href="#" class="mya9">联系我们</a>
          <span>|</span>
          <a href="#" class="mya9">招聘人才</a>
          <span>|</span>
          <a href="#" class="mya9">友情链接</a>

          <p class="myp1">
            CopyRight &copy; 2016 北京天天生鲜信息技术有限公司 All Right
            Reserved
          </p>

          <p class="myp1">电话： 010-****888 京ICP备*******8号</p>
        </div>
      </div>
    </div>
  </div>
</body>

</html>